<div class="m-portlet">
  <div class="m-portlet__head">
    <div class="g-card-title">历史记录</div>
    <a class="btn btn-secondary m-btn m-btn--icon" [routerLink]="'/logs/area/config'">
      <span>
        <i class="flaticon-interface-7"></i>
        <span>查看全部</span>
      </span>
    </a>
  </div>
  <div class="m-portlet__body">
    <div class="_timeline">
      <div class="m-timeline-2">
        <div class="m-timeline-2__items _items">
          <div class="m-timeline-2__item _item" *ngFor="let r of result$ | async | slice: 0:length">
            <div class="m-timeline-2__item-time pt-0">
              <div class="_datetime">
                <span class="_time">{{ r.created_at | date: 'HH:mm' }}</span>
                <span class="_date">{{ r.created_at | date: 'yyyy/MM/dd' }}</span>
              </div>
            </div>
            <div class="m-timeline-2__item-cricle">
              <i class="fa fa-genderless m--font-info"></i>
            </div>
            <div class="m-timeline-2__item-text">
              <div class="text">
                <ng-container *ngIf="r.target_type !== TargetType.Area && r.area_name">
                  <span class="var">
                    {{ r.area_name }}
                  </span>
                  <span>中</span>
                </ng-container>
                <span class="var">{{ r.full_name }}</span>
                <span>操作</span>
                <span class="var">{{ r.target_name || '未知' + r.target_desc }}</span>
                <span>执行</span>
                <span class="var">{{ r.operation_desc }}</span>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
